Interactive graphics. Text Visualization

Navigation operator:

• Camera location
• Viewing direction
• Level of details (e.g. hierarchical representations)

Australian crabs

• User isolates a subset of objects
  • Highlighting
• How to implement?
  • Click
  • Click+hold
  • Bounding box, lasso

Australian crabs

• Related observations are linked in corresponding views
• Selection operator+Connection operator = Brushing
  • Persistent and transient

• Challenges
  • How to link data with various mappings
    • Ex: Histogram and scatter plot
    • Ex: link in which direction? (Hierarchically connected)
  • How to define the corresponding link (key)?
  • Allow for disconecting views?

• Australian crabs:
  • Which sex do the upper-cluster-crabs have?

• Reducing data according to specifications

• Transforming data
  • Sorting rows, reorder columns, MDS
  • Change aesthetics mapping

• Changing the visualization type
• Changing aesthetics
  • Another color map
  • Change shapes
  • …

• Distoring objects locally or globally

• What can the operators be applied to?
• What actions does it imply?

Screen space:

• Navigation: pixel-wise actions
• Selection: sets of pixels (boxes, polygons,…)
• Abstraction: distortion of image (fisheye)
• Filtering: removing some pixels

Data value space

• Operate observations instead of pixels
• Navigating: translate the axis range
• Zooming: increase/decrease axis range
• Filtering: sample the data, sample dimensions
• Reconfiguring: sorting observations, dimensions, nonlinear transformations

Data structure space

• Different data structures exist: matrix, list, graph,…

• Navigation operator: how navigate the view in the long tree?
• Selection operator: node in the tree is selected -> subbranches must be selected
• Filtering operator: Social network: click on node - nodes that are X links away disappear

• Abstraction/Elaboration: histogram with zooming - recompute bars?

• Working with aesthetics

• Navigation: change range of aesthetics to certain interval (show certain range of colors)
• Encoding operator: change shapes of symbols, non-linear color mapping

• Selection: highlight certain ranges of aesthetics (highlight stars)

• Dashboards, scatter plot matrices
  • How to navigate user in these?
  • Which components of dashboard can user hide, move, rearrange?
  • Distortion of certain elements

• Measurements of fleas and their types
• Which operators are available here?
• Which clusters do you see?

Without Shiny: key ingredients

• Create cross-talk objects from your dataframes by d<-SharedData$new(data, key, group)
  • key parameter should point to same observations in dataframes
    • Not specified: row id used
  • Group - a unique name related to the same data

Without Shiny: key ingredients

1. highlight-function:
   • applied to Plotly object
   • parameters:
     • on: ‘plotly_click’, ‘plotly_selected’,…
     • persistent: TRUE/FALSE
     • dynamic:T/F - enables color selector
     • selectize: T/F text field for selection

d <- SharedData$new(crabs)
scatterCrab <- plot_ly(d, x = ~CL, y = ~RW) %>%
  add_markers(color = I("black"))

barCrab <-plot_ly(d, x=~sex)%>%add_histogram()%>%layout(barmode="overlay")

subplot(scatterCrab,barCrab)%>%
  highlight(on="plotly_select", dynamic=T,
            persistent = T, opacityDim = I(1))%>%
  hide_legend()

plotly_data(barCrab)

## # A tibble: 200 x 9
##    species sex   index    FL    RW    CL    CW    BD .crossTalkKey
##    <fct>   <fct> <int> <dbl> <dbl> <dbl> <dbl> <dbl> <chr>        
##  1 Blue    Male      1   8.1   6.7  16.1  19     7   1            
##  2 Blue    Male      2   8.8   7.7  18.1  20.8   7.4 2            
##  3 Blue    Male      3   9.2   7.8  19    22.4   7.7 3            
##  4 Blue    Male      4   9.6   7.9  20.1  23.1   8.2 4            
##  5 Blue    Male      5   9.8   8    20.3  23     8.2 5            
##  6 Blue    Male      6  10.8   9    23    26.5   9.8 6            
##  7 Blue    Male      7  11.1   9.9  23.8  27.1   9.8 7            
##  8 Blue    Male      8  11.6   9.1  24.5  28.4  10.4 8            
##  9 Blue    Male      9  11.8   9.6  24.2  27.8   9.7 9            
## 10 Blue    Male     10  11.8  10.5  25.2  29.3  10.3 10           
## # … with 190 more rows

• Link can be one-to-many or even dynamic (scatter/barchart)

m <- SharedData$new(mpg)
p1 <- ggplot(m, aes(displ, fill = class)) + geom_density()
p2 <- ggplot(m, aes(displ, hwy, fill = class)) + geom_point()
subplot(p1, p2) %>% highlight("plotly_click") %>% hide_legend()

## Warning: All elements of `...` must be named.
## Did you want `key = c(key)`?

Applications:

• Articles, books
• Emails, blogs, websites
• Program Logs
• Collections (corpus) of books, blogs,..

Analysis:

• Understanding structure/context of text
• Group similar documents
• Developent of contents/topics over time

• Vector Space Model
  • Count occurance of each word in a document
  • Columns: frequencies of words
  • Term/document matrix ( for collection of documents): columns=words, rows=documents
• TF-IDF model
  • Measures relative importance of word in document
    • $Tf(w)$=frequency of word, $df(w)$=frequency of documents, $N$=#documents

• Words are placed in 2D
• Layout decided algorithmically
• $Tf(w) \rightarrow$ size of words
• Another aesthetics: color

Issues:

• Stop words need to be removed
• Words sharing the same stem aggregated
• Synonyms
• “Satisfied”/“not satisfied” example
• Incorrect spelling?
• Hyphens and apostrophes
• Does not show the structure

• Root= word of interest
• Branches = contexts the word used
  • Type a combination of words and observe the tree, check its branches

https://www.jasondavies.com/wordtree/

• Graph that analyses co-occurances
  • ‘A and B’, ‘A of B’, ‘A’s B’, ‘A B’, ‘A is B’,…
• Understanding of context without reading

1. Go https://www.cg.tuwien.ac.at/courses/InfoVis/HallOfFame/2011/Gruppe08/Homepage/
2. Download soft (need Java installed)
3. Upload File
4. Define connector word (is, are, [space], of, and,…)
5. Filter stop words

• Example “Romeo and Julia” (is, are)

• Size of the word = word freq
• Thickness of the connection =co-occurance freq
• Color: dark colors -> word often to the left
• Close on map -> often close in the document

Analysis:

• Analyse most frequent
• Analyse connections and paths
• Analyse strength of paths and intensity of colors
• Click a specific word and look at the respective paths
• Zoom in and out

• Analyses thematic changes in document collections over time

https://hrbrmstr.github.io/streamgraph/

• Example: #movies by genre,different years
• Perception problem: angles in areas

• Other tools for document collection:
  • Place similar documents close in 2D (MDS, clustering, SOM)
• Graph/network visualization can be used for text
• A plenty of other visualizations for text:

http://textvis.lnu.se/

• Chapters 10,11
• Plotly book, ch. 15, 16

• Van Ham, F., Wattenberg, M., & Vi?gas, F. B. (2009). Mapping text with phrase nets. IEEE transactions on visualization and computer graphics, 15(6).

• Wattenberg, M., & Vi?gas, F. B. (2008). The word tree, an interactive visual concordance. IEEE Transactions on Visualization & Computer Graphics, (6), 1221-1228.